<!--初始化，初始化大模型，剪映参数-->
<script setup lang="ts">

import {TypeList} from "~/data/ai/workeditdata";
import type {ComfyModel, VoiceModel} from "~/utils/jiangying";
import ImageUpload from "~/components/ai/ImageUpload.vue";
import {useVoiceTTS, useVoiceVitsGetCharacters} from "~/composables/VoiceHooks";
import {useWorkInitComfyModel} from "~/composables/workedithooks";
import WorkEditVoiceModelSelect from "~/components/workedit/WorkEditVoiceModelSelect.vue";
import {VNumberInput} from 'vuetify/labs/VNumberInput'
import AudioPlayer from "~/components/video/AudioPlayer.vue";
import WorkEditAddChatTTSRole from "~/components/workedit/WorkEditAddChatTTSRole.vue";

const activator = defineModel<boolean>({
  default: false
})
const t_header = ['序号', '名称', '预览图片(点击替换）', '适用风格']
const {models, animations, effects, transitions, voiceModels, localProjectPath} = storeToRefs(useWorkEditStore())

const handleInitComfyModel = async () => {
  await useWorkInitComfyModel()
}
onMounted(async () => {

})


const file = ref<File | null>(null)
//读取剪映的文件的特效动画等参数
watch(file, (newValue) => {
  if (newValue) {
    // 从剪映配置文件读取特效，动画等
    const reader = new FileReader()
    reader.readAsText(newValue)
    reader.onload = function () {
      const result = reader.result
      const data = JSON.parse(result as string)
      //保存特效数据
      const _t = data['materials']["transitions"]
      const _e = data['materials']["video_effects"]
      let _a = [] as any[]
      data['materials']["material_animations"].forEach((item: any) => {
        _a = _a.concat(item["animations"])
      })
      console.log(_a)
      animations.value = _a
      transitions.value = _t
      effects.value = _e
      useSnackbarStore().showSuccessMessage('剪映配置初始化成功')
    }
  }
})


const show = ref(false)
/**
 * 初始化声音模型
 */
const handleInitGPTVits = async () => {
  voiceModels.value=[]
  voiceModels.value = await useVoiceVitsGetCharacters()
  handleAddChatTTS()
  useSnackbarStore().showSuccessMessage('语音模型初始化成功')
}

/**
 * 添加ChatTTS默认声音模型
 */
const ChatTTSModels=[
  {
    id: 101,
    name: '男-纯情大学生',
    tts: 'ChatTTS',
    voice:'11'
  },
  {
    id: 102,
    name: '男-阳光大男孩',
    tts: 'ChatTTS',
    voice:'11'
  },
  {
    id: 103,
    name: '女-知心小姐姐',
    tts: 'ChatTTS',
    voice:'13'
  },
  {
    id: 104,
    name: '女-温柔小姐姐2',
    tts: 'ChatTTS',
    voice:'2'
  },
] as VoiceModel[]


const handleAddChatTTS = () => {
  voiceModels.value=[...voiceModels.value,...ChatTTSModels]
}




</script>

<template>
  <v-dialog
      v-model="activator"
      max-width="80%">
    <template v-slot:default="{ isActive }">
      <v-card>
        <v-card-title class="d-flex justify-space-between align-center">
          <v-label class="text-h6 font-weight-bold">项目初始化</v-label>
          <v-btn
              icon="mdi-close"
              variant="text"
              @click="activator = false"
          ></v-btn>
        </v-card-title>
        <v-card-text>
          <v-label class="text-h6 font-weight-bold">剪映项目路径配置</v-label>
          <v-text-field v-model="localProjectPath" label="剪映项目路径（存放项目资源，不是草稿文件路径）"
                        variant="underlined"></v-text-field>
          <v-label class="text-h6 font-weight-bold">1、初始化大模型
            <span class="text-red text-h6 font-weight-bold">(将丢失原有的配置数据）</span>

          </v-label>
          <v-card-actions>
            <v-btn
                color="warning"
                variant="flat"
                prepend-icon="mdi-pencil"
                @click="handleInitComfyModel"
            >初始化大模型
            </v-btn>

            <v-spacer></v-spacer>

            <v-btn
                :icon="show ? 'mdi-chevron-up' : 'mdi-chevron-down'"
                @click="show = !show"
            ></v-btn>
          </v-card-actions>
          <!--大模型列表-->
          <v-expand-transition>
            <div v-show="show">
              <v-table density="compact">
                <thead>
                <tr>
                  <th class="text-left" v-for="(item,index) in t_header" :key="index">
                    {{ item }}
                  </th>
                </tr>
                </thead>
                <tbody>
                <tr
                    v-for="(item,index) in models"
                    :key="index"
                >
                  <td width="100">{{ index }}</td>
                  <!--              大模型名称-->
                  <td width="100">{{ item.name }}</td>
                  <!--              预览图片-->
                  <td width="200">
                    <image-upload decription="预览图片" v-model:url="item.cover" :src="item.cover"/>
                  </td>
                  <!--              适用风格类型-->
                  <td width="200">
                    <v-select :items="TypeList" item-title="name" item-value="id" v-model="item.types"
                              multiple></v-select>
                  </td>
                </tr>

                </tbody>
              </v-table>
            </div>
          </v-expand-transition>
          <v-divider color="black"/>
          <v-divider/>
          <v-label class="text-h6 font-weight-bold">2、初始化剪映参数</v-label>
          <v-divider/>
          <v-label class="text-caption text-gray-600">
            在剪映草稿中，增加你喜欢的特效、动画和转场，然后上传(draft_content.json文件)自动配置
          </v-label>
          <!--          上传剪映文件-->
          <v-file-input label="上传draft_content.json文件" v-model="file" variant="underlined"></v-file-input>
          <v-label class="text-h6 font-weight-bold">3、初始化语音模型</v-label>
          <v-divider/>
          <v-label class="text-caption text-gray-600">
            1.如果您使用GPT VITS，启动GPT VITS服务之后，执行该初始化操作，自动获取你本地的语音模型
          </v-label>
          <v-spacer/>
          <v-btn
              color="warning"
              variant="flat"
              class="ma-2"
              prepend-icon="mdi-pencil"
              @click="handleInitGPTVits"
          >初始化GPTVITS声音模型
          </v-btn>
          <!--          测试和添加ChatTTS模型-->
          <v-spacer/>
          <WorkEditAddChatTTSRole/>

        </v-card-text>
      </v-card>
    </template>
  </v-dialog>


</template>

<style scoped lang="scss">

</style>